import 'package:flutter/material.dart';

class MyApp21 extends StatelessWidget {
  MyApp21({super.key});
  final List data = [
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/58a7c1f62df4cb1eb47fe83ff0e566e6.png",
      "imgName": "icon-1.png",
      "link": {
        "id": "c37c2ee",
        "title": "分类页",
        "type": "PAGE",
        "param": {"path": "pages/category/index", "url": "pages/category/index"}
      },
      "text": "新品首发"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/49c64dbbf449e9e8abfca314f92814bd.png",
      "imgName": "icon-2.jpg",
      "link": {
        "id": "c37c2ee",
        "title": "分类页",
        "type": "PAGE",
        "param": {"path": "pages/category/index", "url": "pages/category/index"}
      },
      "text": "居家生活"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/8573fbc5e87e8a88827e905fca284604.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "服饰鞋包"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/f01c5fc360f55c6053beec34913bc699.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "美食酒水"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/b106e9bd9e0c8c779e7d77a84e92ed93.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "个护清洁"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/fd3a573889671b924d89859f521c30c9.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "母婴亲子"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/8f979924a4fd3b5f406b62a6b405ea32.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "运动旅行"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/f7657720f79ea9f769c40608f369130e.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "数码家电"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/36f09e32efc53e1e695210ca92c54ed8.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "宠物生活"
    },
    {
      "imgUrl":
          "https://smart-shop.itheima.net/uploads/10001/20230320/0cccdb31952fbf3bc0026efbe260e40e.png",
      "imgName": "icon-1.png",
      "link": null,
      "text": "每日抄底"
    }
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('customScrollView的使用'),
        backgroundColor: Colors.red,
      ),
      body: CustomScrollView(
        slivers: [
          //顶部网格布局
          SliverGrid.builder(
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 5,
                mainAxisSpacing: 10,
                crossAxisSpacing: 10,
                childAspectRatio: 1),
            itemBuilder: (context, index) {
              return Container(
                color: Colors.blueGrey,
                child: Column(
                  children: [
                    Image.network(
                      data[index]['imgUrl'],
                      width: 50,
                      height: 50,
                    ),
                    const SizedBox(height: 10),
                    Expanded(
                        child: Text(
                      '${data[index]['text']}',
                      style: const TextStyle(fontSize: 14),
                    ))
                  ],
                ),
              );
            },
            itemCount: 10,
          ),
          const SliverPadding(padding: EdgeInsets.all(10)),
          SliverList(
              delegate: SliverChildBuilderDelegate((context, index) {
            return Container(
              height: 50,
              margin: const EdgeInsets.only(bottom: 10),
              color: const Color.fromARGB(255, 200, 233, 202),
              child: const Text('我是list列表'),
            );
          }, childCount: 20))
        ],
      ),
    );
  }
}
